<!DOCTYPE HTML>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ include file='share_header.jsp' %>
<html>

<head>
    <title>中钢集团CRM管理系统登陆</title>
</head>
<link href="${pageContext.request.contextPath}/resources/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="${pageContext.request.contextPath}/resources/css/unicorn.login.css" rel="stylesheet"  type="text/css">
<link href="${pageContext.request.contextPath}/resources/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css">
<%--<link href="${pageContext.request.contextPath}/resources/css/layout.less" rel="stylesheet/less" type="text/css">--%>
<link href="${pageContext.request.contextPath}/resources/css/layout.css" rel="stylesheet" type="text/css">
<link href="${pageContext.request.contextPath}/resources/css/dialogue.css" rel="stylesheet"  type="text/css">

<body>
<div id="manageMain">
    <div id="loginBody">
        <div id="loginBox" class="row-fluid">
            <form id="m-loginForm" class="form-vertical" action="javascript:loginAjax()">
                <h3 style="padding-bottom: 15px">中钢集团CRM管理系统</h3>

                <div class="control-group">
                    <div class="controls">
                        <div class="input-prepend">
                            <span class="add-on">
                                <i class="icon-user"></i>
                            </span>
                            <input type="text" id="username" name="username" class="loginInput" placeholder="Username">
                        </div>
                    </div>
                </div>
                <div class="control-group">
                    <div class="controls">
                        <div class="input-prepend">
                            <span class="add-on">
                                <i class="icon-lock"></i>
                            </span>
                            <input type="password" id="password" name="password" class="loginInput" placeholder="Password">
                        </div>
                    </div>
                </div>

                <div class="form-actions">
                    <%--<span class="pull-left"><a href="#" class="flip-link" id="to-recover">Lost password?</a></span>--%>
                    <span class="pull-right">
                        <input type="submit" id="loginButton" class="btn btn-primary" value="登陆">
                    </span>
                </div>
            </form>
        </div>
    </div>
</div>

</body>
<%--<script src="${pageContext.request.contextPath}/resources/js/less.min.js" type="text/javascript"></script>--%>
<script src="${pageContext.request.contextPath}/resources/js/jquery/jquery-1.11.3.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/crm.base.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/jsonToTable.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/pagination.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/dialogue.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/jquery.validate.js"></script>


<%--<script src="${pageContext.request.contextPath}/resources/js/jquery.dataTables.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/resources/js/jquery-ui-1.7.custom.min.js"></script>--%>
<%--<script src="${pageContext.request.contextPath}/resources/js/jquery.tooltip.min.js"></script>--%>


<script type="text/javascript">
    //table的样式类
    var tableClass = "table table-bordered table-striped with-check tableFixed";
    //分页条数
    var pageSize = 10;
    var webPath = "${pageContext.request.contextPath}";

    $(function () {
        $("#m-loginForm").validate({
            errorElement: 'div',
            errorClass: 'help-inline',
            focusInvalid: false,
            rules: {
                username: {
                    required: true
                },
                password: {
                    required: true
                }
            },
            messages: {
                username: {
                    required: "用户名不能为空！"
                },
                password: {
                    required: "密码不能为空！"
                }
            },
            highlight: function (element) {
                $(element).closest('.control-group').addClass('error');
            },
            success: function (label) {
                label.closest('.control-group').removeClass('error');
                label.remove();
                //height的大小控制，错误时向下挤压 关联参数 总高度225px 增加高度25px 关联文件 unicorn.login.css
                var loginBoxHeight = $("#loginBox").height();
                if(loginBoxHeight > 230){
                    $("#loginBox").height(loginBoxHeight - 25);
                }
            },
            errorPlacement: function (error, element) {
                element.parent('.input-prepend').after(error);
                $("#loginBox").height($("#loginBox").height() + 25);
            }
        });
    });

    function loginAjax() {
        $("#loginButton").attr("disabled", "true");
        $("#m-loginForm").valid();
        $.ajax({
            type: "post",
            data: $("#m-loginForm").serialize(),
            url: webPath + "/crm/login.do",
            success: function (result) {
                $('#manageMain').html(result);
                if($("#loginErrorMsg")&&$("#loginBox").height()<240){
                    $("#loginBox").height($("#loginBox").height() + 25);
                }
            },
            error: function () {
                $("#loginButton").attr("disabled", null);
            }
        });
    }

</script>
</html>